@extends("base.base")
@section('main')
    <link rel="stylesheet" href="{{asset(env('CDN_HOST')."/public/css/commodity/search.css")}}">
    <style>
        .header {
            width: 96vw;
            height: 4.2rem;
            background: #ffffff;
            /*border-bottom: 1px solid #ececec;*/
            margin: 1rem 0;
            margin-left: 2vw;
            padding-top: 20rem;
        }

        .header-search {
            float: left;
            height: 3rem;
            width: 80vw;
            line-height: 3rem;

            border-radius: 0.3rem;
            color: #666666;
            background: #ededed;
        }

        .search {
            width: 100vw;
            min-height: 96vh;
            height: auto;
            background: #ffffff;
        }

        .header-search {
            text-align: left;
        }

        .search-left {
            width: 8vw;
            text-align: center;
        }

        .search-right {
            width: 70vw;
        }

        .search-div {
            display: inline-block;
            float: left;
        }

        .search-input {
            display: block;
            border: none;
            width: 80vw;
            line-height: 3rem;
            background: rgba(0, 0, 0, 0);
        }

        .search-return {
            width: 14vw;
            line-height: 3rem;
            text-align: center;
            font-size: 1.6rem;
        }

        * {
            border: none;
        }
    </style>
    <main id="search" class="search">
        <nav id="header" class="header">
            <div class="header-search">
                <div class="search-div search-left"><i class="fa fa-search"></i></div>
                <div class="search-div search-right">
                    <input type="search" id="inputSearch" class="search-input" placeholder="搜索商品, 共9569款好物">
                </div>
                {{--<div style="clear: both"></div>--}}
            </div>
            <div class="search-div search-return">
                &emsp;取消
            </div>
            <div style="clear: both"></div>
        </nav>
        <script>
            $('html').show()
            $('.search-return').click(function () {
                history.go(-1)
            })
            loading.hide()
            $("#inputSearch").keydown(function (event) {
                if (event.keyCode == 13) {
                    var text = $("#inputSearch").val()
                    if (text == "")
                        return false
                    loading.show()
                    window.location.href = "/commodity/search/" + text
                }
            })
            $(".header-search").click(function () {
                var text = $("#inputSearch").val()
                if (text == "")
                    return false
                loading.show()
                window.location.href = "/commodity/search/" + text
            })
        </script>
    </main>
@endsection